Skip to content

Consolidate tabs and menu into titlebar#9

Merged
asystemoffields merged 3 commits intomainfrom
claude/fab-to-dropdown-menu-XpiX0
Mar 8, 2026
Merged

Consolidate tabs and menu into titlebar#9
asystemoffields merged 3 commits intomainfrom
claude/fab-to-dropdown-menu-XpiX0

Conversation

@asystemoffields
Copy link
Copy Markdown
Owner

This PR refactors the UI layout to integrate tabs and the dropdown menu directly into the titlebar, eliminating the separate tabbar and improving space efficiency.

Summary

The editor previously had a separate tabbar below the titlebar for tab management. This change moves tab rendering and interaction into the titlebar itself, and consolidates the menu system into a single dropdown button positioned after the tabs. This creates a more compact, modern interface similar to contemporary text editors.

Key Changes

  • Tabs moved to titlebar: Tab rendering and click handling moved from render_tabbar() into render_titlebar(), positioned inline starting from the left edge after a small margin
  • Unified dropdown menu: Replaced individual FAB (floating action button) menu triggers with a single dropdown trigger button (▾) positioned after the new tab (+) button
  • Menu structure enhanced: The dropdown now displays all menu categories with headers and separators, rather than showing only one menu at a time
  • Layout constants updated:
    • TITLEBAR_H reduced from 40 to 36 pixels
    • TABBAR_H set to 0 (no longer used)
    • MENUBAR_H remains 0
  • State tracking simplified:
    • Replaced fab_hover with dropdown_hover (boolean)
    • Added dropdown_btn_x to track computed dropdown button position
    • menu_open now uses -1 for closed, 0+ for open state
    • menu_hover_item now uses flat indexing across all menus
  • Click and hover handling: Updated all mouse event handlers to work with the new inline tab layout and unified dropdown positioning

Implementation Details

  • Tab width calculation and clamping logic preserved from original tabbar
  • Dropdown positioning now based on dropdown_btn_x computed during titlebar rendering
  • Menu hover tracking uses a flat index across all menu categories to support the new unified dropdown display
  • Window control buttons (minimize/maximize/close) remain on the right side of the titlebar

https://claude.ai/code/session_013uWpT9xBhNcN2PtRU4XotZ

claude added 3 commits March 8, 2026 02:44
Remove the 4 floating action buttons from the titlebar and replace with
a single compact dropdown trigger (▾) that opens a combined menu showing
all categories (File, Edit, Search, View) with section headers. Reduce
titlebar height from 40px to 30px so tabs and title move up.

https://claude.ai/code/session_013uWpT9xBhNcN2PtRU4XotZ
Set TABBAR_H to 0 and increase TITLEBAR_H to 36. Tabs are now rendered
inline in the titlebar after the dropdown button, with tab click handling
moved into the titlebar region. The separate render_tabbar() is now a
no-op. This puts the dropdown icon, tabs, and window controls all on one
line, eliminating the second row.

https://claude.ai/code/session_013uWpT9xBhNcN2PtRU4XotZ
Reorder titlebar: tabs start from left edge, then (+) new tab button,
then (▾) dropdown trigger. The + and × (close tab) icons now use
font_ui instead of font_ui_small for better visibility. Dropdown button
position is computed dynamically and stored in dropdown_btn_x so
wndproc hit-testing stays in sync. The dropdown menu panel now appears
below the trigger button wherever it ends up.

https://claude.ai/code/session_013uWpT9xBhNcN2PtRU4XotZ
@asystemoffields asystemoffields merged commit 2eae952 into main Mar 8, 2026
1 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants